{% extends 'IcsocUIBundle::page.html.twig' %}
{% from 'IcsocUIBundle:Macro:grid.html.twig' import gridWidth,gridNav,gridConfig,sendKeyWord %}
{% from 'IcsocUIBundle:Macro:actions.html.twig' import searchtime,timebutton,searchForm,searchFormBtn %}
{% block stylesheet %}
    {{ parent() }}
    {% stylesheets
    '@jqgird_css'
    '@datepicker_css'
    filter='cssrewrite' filter='uglifycss'
    %}
    <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}

{% block content %}
    <form action="" id="searchForm">
        <div class="widget-container-col">
            <div class="widget-box">
                <!-- /section:custom/widget-box.options -->
                <div class="widget-body">
                    <div class="widget-main no-padding">
                        <table class="table table-striped table-bordered table-hover">
                            <tbody>
                                {{ searchForm(options) }}
                                {{ searchtime() }}
                                {{ searchFormBtn() }}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </form></br>
    <table id="grid-table"></table>
    <div id="grid-pager"></div>
{% endblock %}
{% block footer %}
    {% javascripts
    '@jqgird_js'
    '@datepicker_js'
    '@common_js'
    filter='uglifyjs'
    %}
    <script src="{{ asset_url }}"></script>
    {% endjavascripts %}
    <script type="text/javascript">
        jQuery(function($) {
            {{ gridWidth() }}
            jQuery(grid_selector).jqGrid({
                url: "{{ path('icsoc_log_list') }}",  //数据；
                colNames:['id', '{{ 'Action people'|trans }} ','{{ 'Action type'|trans }}',
                    '{{ 'Action content'|trans }}','{{ 'Action people ip'|trans }}','{{ 'Action time'|trans }}'],  //列显示名称，是一个数组对象
                colModel:[
                    {name:'logId',index:'logId',width:80, fixed:true,editable: false, sortable:true},
                    {name:'userNum',index:'title',editable:false, sortable:false},
                    {name:'action',index:'action', editable:false, sortable:false},
                    {name:'content',index:'content', editable:false, sortable:false},
                    {name:'actip',index:'actip',editable:false, sortable:false},
                    {name:'acttime',index:'acttime', editable:false, sortable:true}
                ],
                {{ gridConfig() }}
                editurl: "{{ path('icsoc_notice_opr') }}",//nothing is saved 定义对form编辑时的url
                caption: "{{ 'Log list'|trans }}", //表格名称
                sortname: 'logId'

            });
            $(window).triggerHandler('resize.jqGrid');//trigger window resize to make the grid get the correct size
            //navButtons prmEdit, prmAdd, prmDel, prmSearch, prmView
            jQuery(grid_selector).jqGrid('navGrid',pager_selector,
                    { 	//navbar options
                        edit: false,
                        add: false,
                        del: false,
                        delicon : 'ace-icon fa fa-trash-o red',
                        search: false,
                        refresh: true,
                        refreshicon : 'ace-icon fa fa-refresh green',
                        view: true,
                        viewicon : 'ace-icon fa fa-search-plus grey'
                    },
                    {},
                    {},
                    {},
                    {},
                    {}
            );
            function updatePagerIcons(table) {
                var replacement =
                {
                    'ui-icon-seek-first' : 'ace-icon fa fa-angle-double-left bigger-140',
                    'ui-icon-seek-prev' : 'ace-icon fa fa-angle-left bigger-140',
                    'ui-icon-seek-next' : 'ace-icon fa fa-angle-right bigger-140',
                    'ui-icon-seek-end' : 'ace-icon fa fa-angle-double-right bigger-140'
                };
                $('.ui-pg-table:not(.navtable) > tbody > tr > .ui-pg-button > .ui-icon').each(function(){
                    var icon = $(this);
                    var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
                    if($class in replacement) icon.attr('class', 'ui-icon '+replacement[$class]);
                })
            }
        });

        $('#start_time').datetimepicker({locale:'zh-cn',format:'YYYY-MM-DD HH:mm:ss',widgetPositioning:{horizontal:'left'}}).next().on(ace.click_event, function(){
            $(this).prev().focus();
        });
        $('#end_time').datetimepicker({locale:'zh-cn',format:'YYYY-MM-DD HH:mm:ss',widgetPositioning:{horizontal:'left'}}).next().on(ace.click_event, function(){
            $(this).prev().focus();
        });
        jQuery(function($) {
            $('#loading-btn').on(ace.click_event, btnSerach);
            $('#searchForm').on('submit', btnSerach);
        })
        function btnSerach() {
            var btn = $(this);
            btn.button('loading');
            //可以开始获取值进行查询
            var start_time = $('#start_time').val();
            var end_time = $('#end_time').val();
            var keyword = $('#keyword').val();
            var ip = $('#ip').val();
            var filter = new Object();
            filter.start_time = start_time;
            filter.end_time = end_time;
            filter.keyword = keyword;
            filter.ip = ip;
            var str = jsonToString(filter);
            var arr = {'fliter':str};
            $('#grid-table').setGridParam({postData:arr}).trigger("reloadGrid");
            btn.button('reset')
            return false;
        }
    </script>
{% endblock %}